<template>
    <div class="top"><input type="checkbox" v-model="isAllChecked" />全选</div>
</template>

<script>
import { mapState, mapGetters, mapMutations } from "vuex";
export default {
    name: "CartHeader",
    methods: {
        ...mapMutations(["allChange"]),
    },
    computed: {
        ...mapGetters(["allSelect"]),
        isAllChecked: {
            get() {
                return this.allSelect;
            },
            set(value) {
                this.allChange(value);
            },
        },
        ...mapState({
            list: "list",
        }),
    },
};
</script>

<style>
.top {
    height: 40px;
    display: flex;
    align-items: center;
    background-color: pink;
}

.top > input {
    width: 20px;
    height: 20px;
    margin: 0 20px;
}
</style>
